<template>
	<view class="cont">
		<view class="search_box">
			<uni-search-bar @confirm="search" v-model="message" clearButton='auto' placeholder="请输入药材名称"
				:radius="100" />
		</view>
		<view class="keep">
			
		</view>
		
		<uni-popup ref="showpopup" type="bottom" @change="change">
			<view class="popup-content">
				<view class="box uniBtn" v-for="(item,index) in 100" :key="index">
					<view>{{index}}</view>
					<img class="img" src="/static/bg/add2.png" alt="">
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import uniSearchBar from "@/components/uni-search-bar/uni-search-bar.vue";
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	export default {
		components: {
			uniSearchBar,
			uniPopup
		},
		data() {
			return {
				message: '', //搜索内容
				type:''
			}
		},
		methods: {
			search() { //搜索
				var that = this
				if (!that.message.value) {
					uni.showToast({
						title: '请输入搜索内容',
						icon: 'none'
					});
					return
				} else {
					// 初始化数据
					that.list = []
					// that.getServiceGoodsListForCust()
					that.togglePopup()
				}
			},
			togglePopup() {
				this.$nextTick(() => {
					this.$refs['show' + 'popup'].open()
				})
			},
			// cancel(type) {
			// 	this.$refs['show' + 'popup'].close()
			// },
			change(e) {
				console.log('是否打开:' + e.show)
			}
		}
	}
</script>

<style lang="scss" scoped>
.cont{
	.search_box {
		padding:20upx 30upx;
		margin: 0 auto;
		
		.search_box input {
			font-size: 16upx;
		}
	}
	
	// 弹出
	.popup-content{
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		background-color: #fff;
		padding: 15px;
		font-size: 14px;
		height: 85vh;
		overflow-y:scroll;
		
		.box{
			border-bottom: 1px solid #eee;
			padding: 25upx 0;
			
			.img{
				width: 56upx;
				height: 56upx;
				flex:0;
				margin-left: 25upx;
			}
		}
		
		
	}
}
</style>
